<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">

<head>
    <title>重新支付订单</title>
    <div data-th-replace="layout/head"></div>
</head>
<body>
    <div data-th-replace="layout/common-hade-order"></div>
    <div class="mb20 pb10">
        <div class="container">
            <div class="cm-wbg__bx">
                <div class="order-sub__wrap">
                    <section>
                        <div class="clearfix">
                            <aside class="pull-right mt5">
                            <span class="c-warning fs12">
                                <i class="fa fa-warning"></i>
                                 商品在支付成功后，会立即开通。偶有数据延时，请支付成功后耐心等待！
                            </span>
                            </aside>
                            <aside class="pull-left">
                                <span class="fs24 c-warning"><i class="fa fa-gift"></i></span>
                                <span class="ml10 fs20 c-333">商品信息</span>
                                <span class="ml10 fs12 c-999">
                                    共<small class="c-warning fs14 shop-num" th:text="${buyNum}">0</small>件商品
                                </span>
                            </aside>
                        </div>
                        <div class="mt20 pt10 pb10 mb20 ml20 mr20">
                            <section class="row">
                                <article class="col-sm-4">
                                    <div>
                                        <span class="fs16 c-333">商品名称</span>
                                    </div>
                                </article>
                                <aside class="col-sm-3">
                                    <div class="text-center">
                                        <span class="fs16 c-333">价格</span>
                                    </div>
                                </aside>
                                <aside class="col-sm-2">
                                    <div class="text-center">
                                        <span class="fs16 c-333">优惠</span>
                                    </div>
                                </aside>
                                <aside class="col-sm-3">
                                    <div class="text-center">
                                        <span class="fs16 c-333">小计</span>
                                    </div>
                                </aside>
                            </section>
                            <div class="order-course-list" id="shop-list-box">
                                <section th:each="details : ${order['orderDetailsList']}" class="row order-course-item">
                                    <article class="col-sm-4">
                                        <div class="clearfix mr10">
                                            <div th:if="${details['shopType']}=='COURSE'" class="media">
                                                <div class="media-left">
                                                    <a th:href="@{/web/course/courseInfo?courseId={courseId}(courseId=${details['shopId']})}" target="_blank">
                                                        <img class="media-object" width="80" th:src="${details['shop']['course']['imageMap']['pcUrlMap']['medium']}" data-holder-rendered="true"/>
                                                    </a>
                                                </div>
                                                <div class="media-body">
                                                    <section class="cm-desc-txt__twoLine">
                                                        <a th:href="@{/web/course/courseInfo?courseId={courseId}(courseId=${details['shopId']})}" target="_blank" class="fs14 c-999" th:text="${details['shop']['shopName']}"></a>
                                                    </section>
                                                </div>
                                            </div>
                                            <div th:if="${details['shopType']}=='BOOK'" class="media">
                                                <div class="media-left">
                                                    <a th:href="@{/web/book/info?bookId={bookId}(bookId=${details['shopId']})}" target="_blank">
                                                        <img class="media-object" width="80" th:src="${details['shop']['book']['imageMap']['pcUrlMap']['medium']}" data-holder-rendered="true"/>
                                                    </a>
                                                </div>
                                                <div class="media-body">
                                                    <section class="cm-desc-txt__twoLine">
                                                        <a th:href="@{/web/book/info?bookId={bookId}(bookId=${details['shopId']})}" target="_blank" class="fs14 c-999" th:text="${details['shop']['shopName']}"></a>
                                                    </section>
                                                </div>
                                            </div>
                                            <div th:if="${details['shopType']} !='BOOK' and ${details['shopType']} !='COURSE'" class="media">
                                                <div class="media-body">
                                                    <section class="cm-desc-txt__twoLine">
                                                        <a href="javascript:void(0);" class="fs14 c-999" th:text="${details['shop']['shopName']}"></a>
                                                    </section>
                                                </div>
                                            </div>
                                        </div>
                                    </article>
                                    <aside class="col-sm-3">
                                        <div class="text-center">
                                            <span class="fs12 c-999"><i class="fa fa-rmb"></i></span>
                                            <span class="fs16 c-999" th:text="${#numbers.formatDecimal(details['realPrice'],1,2,'POINT')}"></span>
                                            <br th:if="${details['shopType']}=='BOOK'" />
                                            <span th:if="${details['shopType']}=='BOOK'" class="dd">
                                                <small class="btn-group btn-group-sm form-inline">
                                                    <input class="form-control text-center pull-left book-num-inp buy-num-in" disabled th:value="${details['buyNum']}" type="text" style="width: 50px;height: 30px" >
                                                </small>
                                            </span>
                                        </div>
                                    </aside>
                                    <aside class="col-sm-2">
                                        <div class="text-center">
                                            <span class="fs14 c-333" th:text="${#numbers.formatDecimal(details['yhPrice']+details['activityPrice'],1,2,'POINT')}">
                                            </span>
                                        </div>
                                    </aside>
                                    <aside class="col-sm-3">
                                        <div class="text-center">
                                            <span class="fs12 c-danger"><i class="fa fa-rmb"></i></span>
                                            <span class="fs16 c-danger" th:text="${#numbers.formatDecimal(details['realPrice']*details['buyNum'],1,2,'POINT')}">
                                            </span>
                                        </div>
                                    </aside>
                                </section>
                            </div>
                        </div>
                        <hr/>
                    </section>
                    <section class="pt10">
                        <div class="clearfix pt10">
                            <aside class="pull-left">
                                <span class="fs20 c-warning"><i class="fa fa-credit-card"></i></span>
                                <span class="ml10 fs20 c-333">支付方式</span>
                            </aside>
                        </div>
                        <div class="mt20 pt10 ml20 mr20">
                            <div th:if="!${#maps.isEmpty(userAccount)}" class="mb20 pb10">
                                <div class="row">
                                    <div th:if="${userAccount['balance']} >= ${order['realPrice']}" class="col-sm-3 user-account-box-1">
                                        <section data-bank="1" data-type="ACCOUNT" class="blank-item pay-type-sel-box active">
                                            <div class="text-left ml20 mr20 pt10 pb10">
                                                <h6>
                                                    <span class="fs18 c-warning vam"><i class="fa fa-rmb"></i></span>
                                                    <span class="fs16 c-666 ml5 vam">账户余额</span>
                                                    <span class="ml5 fs18 c-333 vam" th:text="'￥'+${userAccount['balance']}"></span>
                                                    <span class="fs16 c-666 vam">元</span>
                                                </h6>
                                                <div class="mt20 text-right"><span class="fs c-999"><i class="fa fa-check"></i> 可以使用</span></div>
                                            </div>
                                        </section>
                                    </div>
                                    <div th:if="${order['realPrice']} > ${userAccount['balance']}" class="col-sm-3 user-account-box-2">
                                        <section class="blank-item noPay">
                                            <div class="text-left ml20 mr20 pt10 pb10">
                                                <h6>
                                                    <span class="fs18 c-999 vam"><i class="fa fa-rmb"></i></span>
                                                    <span class="fs16 c-999 ml5 vam">账户余额</span>
                                                    <span class="ml5 fs18 c-999 vam" th:text="'￥'+(${userAccount['balance']}!=null?${userAccount['balance']}:0)"></span>
                                                    <span class="fs16 c-666 vam">元</span>
                                                </h6>
                                                <div class="mt20 text-right"><span class="fs c-999"><i class="fa fa-times"></i> 余额不足</span></div>
                                            </div>
                                        </section>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <form id="orderForm" style="display: none;">
                                    <input type="hidden" id="orderNo" name="orderNo" th:value="${order['orderNo']}"/>
                                </form>
                                <div th:if="!${#maps.isEmpty(configMap)} and ${configMap['alipayStatus']}=='on'" class="col-sm-3">
                                    <section data-type="ALIPAY" class="blank-item pay-type-sel-box">
                                        <img th:src="@{{path}/common/v3/img/bank/ALIPAY.jpg?v={v}(path=${staticPath},v=${v})}" width="" height="" alt="支付宝支付">
                                    </section>
                                </div>
                                <div th:if="!${#maps.isEmpty(configMap)} and ${configMap['weixinStatus']}=='on'" class="col-sm-3">
                                    <section data-type="WEIXIN" class="blank-item pay-type-sel-box">
                                        <img th:src="@{{path}/common/v3/img/bank/WEIXIN.jpg?v={v}(path=${staticPath},v=${v})}" width="" height="" alt="微信支付">
                                    </section>
                                </div>
                            </div>
                        </div>
                        <hr>
                    </section>

                    <section th:if="${order['orderType']}=='COMMON' and !${#maps.isEmpty(order['orderBook'])}" class="pt10">
                        <section class="col-sm-6 mt20">
                            <div class="blank-item">
                                <div class="text-left ml10 mr10 pt10 pb10">
                                    <div class="clearfix">
                                        <section class="col-sm-2 text-right">
                                            <span class="fs12 c-999">收货人：</span>
                                        </section>
                                        <section class="col-sm-10">
                                            <span class="fs12 c-666" th:text="${order['orderBook']['addressMap']['userName']}"></span>
                                        </section>
                                    </div>
                                    <div class="clearfix">
                                        <section class="col-sm-2 text-right">
                                            <span class="fs12 c-999">地址：</span>
                                        </section>
                                        <section class="col-sm-10">
                                            <span class="fs12 c-666" th:text="${order['orderBook']['addressMap']['address']}"></span>
                                        </section>
                                    </div>
                                    <div class="clearfix">
                                        <section class="col-sm-2 text-right">
                                            <span class="fs12 c-999">手机号：</span>
                                        </section>
                                        <section class="col-sm-10">
                                            <span class="fs12 c-666" th:text="${order['orderBook']['addressMap']['mobile']}"></span>
                                        </section>
                                    </div>
                                    <div class="clearfix">
                                        <section class="col-sm-2 text-right">
                                            <span class="fs12 c-999">邮编：</span>
                                        </section>
                                        <section class="col-sm-10">
                                            <span class="fs12 c-666" th:text="${order['orderBook']['addressMap']['postCode']}"></span>
                                        </section>
                                    </div>
                                </div>
                            </div>
                        </section>
                    </section>
                    <div id="activity-code-list">

                    </div>
                    <section class="mt20 pt10 mb20 pb10">
                        <div class="text-right">
                            <p class="hLh30">
                                <span class="c-666">共
                                    <small class="c-danger fs16 shop-num" id="shop-num" th:text="${buyNum}"></small>
                                    件商品，商品总金额：
                                </span>
                                <span class="ml20">
                                    <small class="c-danger" id="sum-price"><i class="fa fa-rmb mr5"></i>
                                        <samp th:text="${#numbers.formatDecimal(order['sumPrice'],1,2,'POINT')}"></samp>
                                    </small>
                                </span>
                            </p>
                            <p class="hLh30">
                                <span class="c-666">优惠：</span>
                                <span class="ml20">
                                    <small class="c-danger" id="yh-price"><i class="fa fa-minus mr5"></i>
                                        <samp th:text="${#numbers.formatDecimal(order['activityPrice']+order['yhPrice']+order['memberSubPrice'],1,2,'POINT')}"></samp>
                                    </small>
                                </span>
                            </p>
                            <p class="hLh30">
                                <span class="c-666">运费：</span>
                                <span class="ml20">
                                    <small class="c-danger" id="freight-price"><i class="fa fa-plus mr5"></i>
                                        <samp th:text="${#numbers.formatDecimal(order['freightPrice'],1,2,'POINT')}"></samp>
                                    </small>
                                </span>
                            </p>
                            <p class="hLh30">
                                <span class="c-666">应付：</span>
                                <span class="ml20">
                                    <small class="c-danger fs30" id="real-price"><i class="fa fa-rmb fs14 mr5"></i>
                                        <samp th:text="${#numbers.formatDecimal(order['realPrice'],1,2,'POINT')}"></samp>
                                    </small>
                                </span>
                            </p>
                            <section class="pt10">
                                <button type="button" id="pay-order-but" style="width: 180px" class="btn btn-w-m btn-lg btn-danger unRadius">立即支付</button>
                            </section>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>
    <div data-th-replace="layout/footer"></div>
    <script type="text/javascript" th:src="@{{path}/front/web/business/order/goods/newly-order.js?v={v}(path=${staticPath},v=${v})}"></script>
</body>
</html>